<template>
  <el-container>
    <el-header>
      <h2 class="maintain-title">流程维护</h2>
    </el-header>
    <el-row>
      <el-col :span="24">
        <el-card class="box-card"
                 shadow="hover">
          <div slot="header" class="card-title">
            <span>启动流程</span>
          </div>
          <el-form label-width="120px"
                   :model="startCessModel">
            <el-form-item label="订单项ID:">
              <el-input v-model="startCessModel.orderItemIds"></el-input>
            </el-form-item>
            <el-form-item>
              <el-button type="primary"
                         @click="doSubmitStartCess">确定</el-button>
            </el-form-item>
          </el-form>
        </el-card>
      </el-col>
      <el-col :span="12">
        <el-card class="box-card"
                 style="height:410px"
                 shadow="hover">
          <div slot="header" class="card-title">
            <span>完成销售品级别任务</span>
          </div>
          <el-form label-width="120px"
                   :model="salseLevelModel">
            <el-form-item label="订单项ID:">
              <el-input v-model="salseLevelModel.orderItemIds"></el-input>
            </el-form-item>
            <el-form-item label="任务ID:">
              <el-input v-model="salseLevelModel.taskId"></el-input>
            </el-form-item>
            <el-form-item label="当前处理人:">
              <el-input v-model="salseLevelModel.userId"></el-input>
            </el-form-item>
            <el-form-item label="全局变量:">
              <el-input v-model="salseLevelModel.param"></el-input>
            </el-form-item>
            <el-form-item label="是否同意:">
              <el-input v-model="salseLevelModel.audFlag"></el-input>
            </el-form-item>
            <el-form-item>
              <el-button type="primary"
                         @click="doSubmitSalseLevel">确定</el-button>
            </el-form-item>
          </el-form>
        </el-card>
      </el-col>
      <el-col :span="12">
        <el-card class="box-card"
                 style="height:410px" 
                 shadow="hover">
          <div slot="header" class="card-title">
            <span>完成项目级别任务</span>
          </div>
          <el-form label-width="120px"
                   :model="projectLevelModel">
            <el-form-item label="订单项ID:">
              <el-input v-model="projectLevelModel.orderItemIds"></el-input>
            </el-form-item>
            <el-form-item label="任务ID:">
              <el-input v-model="projectLevelModel.taskId"></el-input>
            </el-form-item>
            <el-form-item label="全局变量:">
              <el-input v-model="projectLevelModel.param"></el-input>
            </el-form-item>
            <el-form-item label="是否同意:">
              <el-input v-model="projectLevelModel.audFlag"></el-input>
            </el-form-item>
            <el-form-item>
              <el-button type="primary"
                         @click="doSubmitProjectLevel">确定</el-button>
            </el-form-item>
          </el-form>
        </el-card>
      </el-col>
      <el-col :span="12">
        <el-card class="box-card" style="height:320px" shadow="hover">
          <div slot="header" class="card-title">
            <span>最高权限完成任务</span>
          </div>
          <el-form label-width="120px"
                   :model="permissionModel">
            <el-form-item label="流程活动实例ID:">
              <el-input v-model="permissionModel.bpmParam"></el-input>
            </el-form-item>
            <el-form-item label="全局变量:">
              <el-input v-model="permissionModel.param"></el-input>
            </el-form-item>
            <el-form-item>
              <el-button type="primary" @click="doSubmitPermission">确定</el-button>
            </el-form-item>
          </el-form>
        </el-card>
      </el-col>
      <el-col :span="12">
        <el-card class="box-card"
                 shadow="hover">
          <div slot="header" class="card-title">
            <span>连线开始</span>
          </div>
          <el-form label-width="120px"
                   :model="connectionModel">
            <el-form-item label="流程实例ID:">
              <el-input v-model="connectionModel.processInstanceId"></el-input>
            </el-form-item>
            <el-form-item label="连线ID:">
              <el-input v-model="connectionModel.transitionId"></el-input>
            </el-form-item>
            <el-form-item label="全局变量:">
              <el-input v-model="connectionModel.param"></el-input>
            </el-form-item>
            <el-form-item>
              <el-button type="primary"
                         @click="doSubmitConnection">确定</el-button>
            </el-form-item>
          </el-form>
        </el-card>
      </el-col>
      <el-col :span="12">
        <el-card class="box-card"
                 shadow="hover">
          <div slot="header" class="card-title">
            <span>完成某一个任务之后的派发</span>
          </div>
          <el-form label-width="120px"
                   :model="afterTaskModel">
            <el-form-item label="流程活动实例ID:">
              <el-input v-model="afterTaskModel.bpmParam"></el-input>
            </el-form-item>
            <el-form-item label="全局变量:">
              <el-input v-model="afterTaskModel.param"></el-input>
            </el-form-item>
            <el-form-item>
              <el-button type="primary"
                         @click="doSubmitAfterTask">确定</el-button>
            </el-form-item>
          </el-form>
        </el-card>
      </el-col>
      <el-col :span="12">
        <el-card class="box-card"
                 shadow="hover">
          <div slot="header" class="card-title">
            <span>派发任务</span>
          </div>
          <el-form label-width="120px"
                   :model="dispatcherTaskModel">
            <el-form-item label="流程实例任务ID:">
              <el-input v-model="dispatcherTaskModel.bpmParam"></el-input>
            </el-form-item>
            <el-form-item label="全局变量:">
              <el-input v-model="dispatcherTaskModel.param"></el-input>
            </el-form-item>
            <el-form-item>
              <el-button type="primary"
                         @click="doSubmitDispatcherTask">确定</el-button>
            </el-form-item>
          </el-form>
        </el-card>
      </el-col>
    </el-row>
  </el-container>
</template>

<script>
import BPMService from '@/api/order/BPMService.js'
export default {
  data () {
    return {
      // 启动流程
      startCessModel: {
        orderItemIds: '',//订单项ID：
      },
      // 完成销售品级别任务
      salseLevelModel: {
        orderItemIds: '',//订单项ID：
        taskId: '',//任务ID：
        userId: '',//当前处理人：
        audFlag: '',//是否同意：
        param: '',//全局变量
      },
      // 完成项目级别任务
      projectLevelModel: {
        orderItemIds: '',//订单项ID：
        taskId: '',//任务ID：
        param: '',//全局变量
      },
      // 最高权限完成任务
      permissionModel: {
        bpmParam: '',//流程活动实例ID：
        param: '',//全局变量：
      },
      // 连线开始
      connectionModel: {
        processInstanceId: '',//流程实例ID：
        transitionId: '',//连线ID：
        param: '',//全局变量：
      },
      // 完成某一个任务之后的派发
      afterTaskModel: {
        bpmParam: '',//流程活动实例ID：
        param: '',//全局变量：
      },
      // 派发任务
      dispatcherTaskModel: {
        bpmParam: '',//流程活动实例ID：
        param: '',//全局变量：
      }
    }
  },
  methods: {
    /**
     * 提交表单:启动流程
     */
    async doSubmitStartCess () {
      try {
        const result = await BPMService.startBpmProcess(this.startCessModel);
        this.$notify({
          title: '成功',
          type: 'success',
          message: result,
          duration: 0
        });
      } catch (error) {
        this.$notify({
          title: '错误',
          message: error,
          type: 'error',
          duration: 0
        });
      }
    },

    /**
     * 提交表单:完成销售品级别任务
     */
    async doSubmitSalseLevel () {
      try {
        const result = await BPMService.finishOneTaskProcess(this.salseLevelModel);
        this.$notify({
          title: '成功',
          type: 'success',
          message: result,
          duration: 0
        });
      } catch (error) {
        this.$notify({
          title: '错误',
          message: error,
          type: 'error',
          duration: 0
        });
      }
    },

    /**
     * 提交表单:完成项目级别任务
     */
    async doSubmitProjectLevel () {
      try {
        const result = await BPMService.finishManyTaskProcess(this.projectLevelModel);
        this.$notify({
          title: '成功',
          type: 'success',
          message: result,
          duration: 0
        });
      } catch (error) {
        this.$notify({
          title: '错误',
          message: error,
          type: 'error',
          duration: 0
        });
      }
    },

    /**
     * 提交表单:最高权限完成任务
     */
    async doSubmitPermission () {
      try {
        const result = await BPMService.godFinishTaskProcess(this.permissionModel);
        this.$notify({
          title: '成功',
          type: 'success',
          message: result,
          duration: 0
        });
      } catch (error) {
        this.$notify({
          title: '错误',
          message: error,
          type: 'error',
          duration: 0
        });
      }
    },
    /**
    * 提交表单:连线开始
    */
    async doSubmitConnection () {
      try {
        const result = await BPMService.startTransitionProcess(this.connectionModel);
        this.$notify({
          title: '成功',
          type: 'success',
          message: result,
          duration: 0
        });
      } catch (error) {
        this.$notify({
          title: '错误',
          message: error,
          type: 'error',
          duration: 0
        });
      }
    },

    /**
     * 提交表单:完成某一个任务之后的派发
     */
    async doSubmitAfterTask () {
      try {
        const result = await BPMService.startAfterActivityProcess(this.afterTaskModel);
        this.$notify({
          title: '成功',
          type: 'success',
          message: result,
          duration: 0
        });
      } catch (error) {
        this.$notify({
          title: '错误',
          message: error,
          type: 'error',
          duration: 0
        });
      }
    },
    /**
     * 提交表单:派发任务
     */
    async doSubmitDispatcherTask () {
      try {

        const result = await BPMService.assignedTaskProcess(this.dispatcherTaskModel);
        this.$notify({
          title: '成功',
          type: 'success',
          message: result,
          duration: 0
        });
      } catch (error) {
        this.$notify({
          title: '错误',
          message: error,
          type: 'error',
          duration: 0
        });
      }
    }
  }
}
</script>

<style>
.box-card {
  margin: 10px;
}
.card-title span{
  font-size: 16px;
  font-weight: bold;
}
.maintain-title {
  margin-top: 10px;
  text-align: center;
  background-color: #ffffff;
  line-height: 50px;
  height: 50px;
  font-size: 32px;
  font-weight: bold;
}
</style>
